<!-- 我的车位  车位申请 -->

<template>
	<view>

		<!-- <view class="tab-container bg-white margin-top" v-if="rooms.length > 0 "> -->
		<view class="cu-list menu">
			<view class="block__title">车位信息</view>

			<view class="cu-item arrow" v-for="(item, key) in rooms" :key="key" :data-item="item"
				@click="myHouseDetail(item)">
				<view class="content padding-tb-sm">
					<view>
						<text class="cuIcon-homefill text-green margin-right-xs"></text>
						业主 {{plotCommunityId}}
					</view>
					<view class="text-gray text-sm">
						<text class="cuIcon-right margin-right-xs">小区</text> {{communityName}}
					</view>
					<view class="text-gray text-sm">
						<text class="cuIcon-right margin-right-xs">车位名称</text> {{item.examineObjectName}}
					</view>
					<view class="text-gray text-sm" v-if="item.carPlate">
						<text class="cuIcon-right margin-right-xs">车牌号</text> {{item.carPlate}}
					</view>
					<view class="text-gray text-sm">
						<text class="cuIcon-right margin-right-xs">提交人</text> {{item.submitter}}
					</view>
					<view class="text-gray text-sm">
						<text class="cuIcon-right margin-right-xs">提交时间</text> {{item.submitterTime}}
					</view>

				</view>
				<view class="action">

					<view class="action_title" v-if="item.status == '通过'">
						已绑定
					</view>
					<view class="action_title" v-if="item.status == '进行中'">
						申请中
					</view>
				</view>

			</view>

			<!-- 				<view class="cu-item" v-if="rooms.length === 0">
					<view class="content">
						<text class="cuIcon-warn text-green"></text>
						<text class="text-grey">暂无车位信息</text>
					</view>
					<view class="action">
			
					</view>
				</view> -->
		</view>

		<view class="bindHandle">
			<button @click="bindApplication" type="primary">绑定车位</button>
		</view>
		<!-- </view> -->
		<!-- 		
		<view v-else>
			<no-data-page></no-data-page>
		</view> -->


	</view>
</template>

<script>
	import context from '../../lib/java110/Java110Context.js';
	const constant = context.constant;
	import noDataPage from '@/components/no-data-page/no-data-page.vue'

	export default {
		data() {
			return {
				rooms: "",
				communityName: '',
				plotCommunityId: '',
				identityType: '',
				bindState: '',
			};
		},

		components: {
			noDataPage
		},
		props: {},

		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad(option) {
			this.plotCommunityId = uni.getStorageSync("plotCommunityId");
			let identity = uni.getStorageSync("bindUserInfo");
			this.identityType = identity.proprietorRole;
			this.bindState = identity.bindState
			this.loadMyCar()
		},
		
		/**
		 * 生命周期函数--监听页面初次渲染完成
		 */
		onReady: function() {},

		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {
			this.loadMyCar()
			let _plotNum = uni.getStorageSync("_selectCommunity");

			if (_plotNum != null && _plotNum != undefined && _plotNum != '') {
				this.communityName = _plotNum.communityName + "小区";
				console.log("小区ID", this.plotCommunityId)
			}
		},

		/**
		 * 生命周期函数--监听页面隐藏
		 */
		onHide: function() {},

		/**
		 * 生命周期函数--监听页面卸载
		 */
		onUnload: function() {},

		/**
		 * 页面相关事件处理函数--监听用户下拉动作
		 */
		onPullDownRefresh() {
			this.loadMyCar()
		},

		/**
		 * 页面上拉触底事件的处理函数
		 */
		onReachBottom: function() {},

		/**
		 * 用户点击右上角分享
		 */
		onShareAppMessage: function() {},
		methods: {
			loadMyCar: function() {
				let _that = this;
				let userIdData = uni.getStorageSync("commonUser");
				_that.userId = userIdData.id
				_that.userName = userIdData.name
				uni.request({
					url: constant.url.mineCar,
					header: context.getHeaders(),
					method: "GET",
					data: {
						communityId: _that.plotCommunityId,
						proprietorId: _that.userId, //业主id
						submitter:_that.userName, 
					},
					success: (res) => {
						_that.rooms = res.data.result
						if (_that.rooms.length < 1) {
							_that.noData = true;
						}
					},
					fail: function(e) {
						wx.showToast({
							title: "服务器异常了",
							icon: 'none',
							duration: 2000
						});
					}
				});
			},

			// 车位详情-解绑
			myHouseDetail: function(_item) {
				uni.navigateTo({
					url: './parkingUnbundling?room=' + JSON.stringify(_item)
				});
			},
			bindApplication: function() {
				uni.navigateTo({
					url: '../applyparking/applyparking'
				});
			}
		}
	};
</script>
<style scoped lang="scss">
	@import "@/pagesB/my/myHouse.css";

	.margin-top {
		margin-top: 0rpx;
	}

	.block__title {
		margin: 0;
		font-weight: 400;
		font-size: 14px;
		color: rgba(69, 90, 100, .6);
		padding: 40rpx 30rpx 20rpx;
	}

	.cu-list {
		width: 100%;
		overflow: auto;
		background-color: white;
		height: calc(100vh - 100rpx);

		.cu-item {
			background-color: #F5F5F5;
			margin: 20rpx 20rpx;
			border-radius: 30rpx;
		}
	}

	.bindHandle {
		width: 100%;
		height: 100rpx;
		position: fixed;
		bottom: 0rpx;
		display: flex;
		justify-content: center;
		background-color: aliceblue;

		button:nth-child(1) {
			margin: 15rpx;
			width: 400rpx;
			height: 70rpx;
			border-radius: 40rpx;
			font-size: 26rpx;
			line-height: 70rpx;
		}
	}
</style>
